<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>初心-设置</title>
		<meta name="description" content="" />
		<meta name="author" content="胡 毅鹏" />
		<!--[if lt IE 9]>
			<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
		<link rel="shortcut icon" href="/favicon.ico" />
        <link rel="stylesheet" href="{{ STATIC_URL }}css/reset.css" type="text/css" media="screen" />
        <link rel="stylesheet" href="{{ STATIC_URL }}css/grid.css" type="text/css" media="screen" />
        <link rel="stylesheet" href="{{ STATIC_URL }}css/master.css" type="text/css" media="screen" />
	</head>
	<body>
		<div>
			<header>
				<div class="container_12">
					<h1><a href="chuxin.html">初  心</a></h1>
					<nav id="mainNav" >
						<a href="chuxin.html">首页</a>
						<a href="#">交易墙</a>
						<a href="#">图书库</a>
						<a href="#">讨论区</a>
					</nav>
					<form action="/search" method="">
						<input type="text" class="search-query" placeholder="搜索" />
					</form>
					<nav id="sideNav" class="gird_3" >
                    <a href="#">{{ user.user.first_name}}</a>
						<a href="#" class="selected">设置</a>
						<a href="#" >退出</a>
					</nav>
	
				</div>
			</header>
			<div class="container_12">
				<div class="grid_8 mainside">
					<div class="settingbox">
			    		<h3>设置
			    			<a href="#" class="more">‹‹&nbsp;返回我的主页</a>
			    		</h3>
			    		<div class="tabs">
			    			<ul>
                                <li class="tab basic"><a href="{% url setting_page %}">基本信息</a></li>
                                <li class="tab icon"><a href="{% url icon_page %}">设置头像</a></li>
                                <li class="tab password"><a href="{% url reset_pwd %}">修改密码</a></li>
                                <li class="tab mail tab_selected"><a href="{% url mail_notif %}">邮件提醒</a></li>
                                <li class="tab sync"><a href="{% url sync %}">动态同步</a></li>
			    			</ul>
			    		</div>
			    		<form method="post" class="settingcontent" enctype="multipart/form-data">
                            {% csrf_token %}
			    			<p><label class="title">头像：</label></p>
			    			<div class="iconcontent">
			    				<p id="icon_big" class="icon_big" >
                                {% if user.head160 %}
                                <img src="{{ MEDIA_URL}}{{ user.head160 }}" alt="胡" />
                                {% else %}
                                <img src="{{ STATIC_URL }}img/160.jpg" alt="胡太狼" />
                                {% endif %}
			    				</p>
			    				<p id="icon_small" class="icon_small" >
                                {% if user.head %}
                                <img src="{{ MEDIA_URL }}{{ user.head }}" alt="胡" />
                                {% else %}
                                <img src="{{ STATIC_URL }}img/48.png" alt="胡太狼" />
                                {% endif %}
			    				</p>
			    			</div>
                            {% for element in form %}
                            <span style="margin-left: 80px;">{{  element.label_tag }}</span>
			    			<div style="margin:10px 0 10px 80px;">
                                <P>
                                {{ element }}
                                </P>
			    			</div>
                            {% endfor %}
			    			<p class="signbtn">
			    				<input type="submit" value="更新" class="btn-submit" style="font-size: 14px;" />
			    			</p>
			    		</form>
			    	</div>
					<div class="wallpanel">
					</div>
			    </div>
			    <div class="grid_4 sidebar">
			     	<div class="communityinfo">
			    		<p>有朋自远方来，不亦乐乎？</p><br />
			    		<p>上传个头像，从此做个有头有脸的人...</p><br />
			    	</div>
			    </div>
			    <div class="clearfix" />
			</div>
			
			<footer class="container_12">
				<nav class="footinfo">
					<a href="#">关于</a>
					<span>·</span>
					<a href="#">联系</a>
					<span>·</span>
					<a href="#">反馈</a>
					<span>&copy;2012 chuxin.me</span>
				</nav>
			</footer>
		</div>
		
		<script src="http://lib.sinaapp.com/js/jquery/1.7/jquery.js" type="text/javascript"></script>
        <script src="{{ STATIC_URL }}js/jquery.validate.js" type="text/javascript"></script>
        <script type="text/javascript">
			$().ready(function() {
				$("#usersetting").validate({
					rules: {
						email: {
							required: true,
							email: true
						},
						oldpassword: {
							required: true,
							minlength: 5
						},
						password: {
							required: true,
							minlength: 5
						},
						confirm_password: {
							required: true,
							minlength: 5,
							equalTo: "#password"
						},
						username: {
							required: true,
							maxlength: 14
						}
					},
					messages: {
						email: "哎呦，请输入有效邮箱地址",
						oldpassword: {
							required: "请输入密码",
							minlength: "密码太寒碜了，需要5个字符以上"
						},
						password: {
							required: "请输入密码",
							minlength: "密码太寒碜了，需要5个字符以上"
						},
		                confirm_password: {
							required: "请输入密码",
							minlength: "密码太寒碜了，需要5个字符以上",
							equalTo: "两次输入不一致，请检查"
						},
						username: {
							required:"那个谁，填个昵称吧",
							maxlength: "你的昵称也太长了吧，记不住啊"
						}
					}
				});
			}); 	
		</script>		
	</body>
</html>
